Repository navigation
feat(lazurio): the column head sits under T3's top row, with the toggle and the wordmark on top - #82
Conversation
…le and the wordmark on top The approved design of the left column (2026-10-17, prototypes-lazurio #56 and #61) puts one band at the top of every column: the toggle that hides the sidebar and the app's name. Under it comes the Environment picker with the gear and the Chat · Apps · Automate switch. In Chat the band is T3's own top row: its toggle, the T3 Code wordmark and the Lazurio label. Until now the overlay put the shell's column head above that row and moved the floating toggle down by the head's height. Now the exported SidebarChromeHeader is a thin wrapper. It renders upstream's row, renamed SidebarChromeTitlebar, and the column head right under it. The thread, legacy and settings sidebars all render the header, so all three have the head. AppSidebarLayout.tsx and its toggle are upstream's again, so they leave the allowlist, and SidebarChrome.tsx moves to the shared seams. The line between the rail and the sidebar comes back in the same decision (amending root decision 0187 point 2). The shell's rail draws it in the colour of the --lazurio-line role, which index.html already maps from T3's sidebar border, so the fork adds nothing for it. The contract test pins the new seam, and the runbook describes both. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…e Lazurio symbol The approved design of the left column (2026-10-17) puts the Lazurio symbol before the word in the label beside T3 Code's wordmark. The design system's logo manual allows only the whole approved asset, and the symbol alone at no less than 16 px. The Organization Admin chose a taller label over a smaller symbol. LazurioBadge in the overlay draws the label: the symbol at 16 px and the word in T3's secondary badge colours and 10 px type, 20 px tall. On a dark look it shows the dark rendition, as blue-500 vanishes on dark ground. The two SVG files are copied unchanged from the design system into apps/web/src/lazurio/brand/, with a note never to edit them. SidebarChrome.tsx swaps T3's small pill for it only where the label is "Lazurio". The contract test pins the swap, and the runbook describes it. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
6357852 to
2cc4665
Compare
agentrozjedemeai
left a comment
There was a problem hiding this comment.
@immakermatty — APPROVED on exact head 2cc4665. The titlebar JSX is preserved; the wrapper places the column head immediately after it in the thread, legacy and settings sidebars, and AppSidebarLayout.tsx is byte-identical to upstream v0.1.0. The two vendored SVG Git blob IDs exactly match design-system-lazurio at 22265ef2, including the dark symbol; the badge uses a 16 px image and T3 secondary colours. The targeted slot and branding contract tests passed (2/2), git diff --check is clean, and the four required CI checks passed on this head (including web typecheck, lint, formatting, full release contract and image build in Server and web compatibility). In the dependency-free review clone the full 33-case contract run passed 32 cases and the remaining case could not resolve @t3tools/shared; CI ran it with installed dependencies and passed. No browser preview was run for this T3 change: verify the light/dark and narrow-screen layout on Ring 0 together with LazurioPlatform#485 before the stable release. Review only; this is not a merge or release authorization.
Problem
In Chat, the toggle that hides the sidebar and the "T3 Code" wordmark sit under the Lazurio column head (the Environment picker, the gear and the Chat · Apps · Automate switch). The Organization Admin approved a design for the left column on 2026-10-17 (wireframe HumanAndMachine-ai/prototypes-lazurio#56 and #61):
Change
apps/web/src/components/sidebar/SidebarChrome.tsx:SidebarChromeTitlebar. That is a one-line rename; its JSX is untouched.SidebarChromeHeaderis a thin wrapper: the row, then<lazurio-column-head active="chat">.AppSidebarLayout.tsxis byte-identical to upstream v0.1.0 again.allowed_upstream_changes.SidebarChrome.tsxmoves to the shared seams, because rows 7 and 16 both change it.--lazurio-linerole, whichindex.htmlalready maps from T3's--contrast-sidebar-border. So it follows light, dark and every theme with no fork change.63578526), as the approved design shows.apps/web/src/lazurio/LazurioBadge.tsxdraws it: the symbol at 16 px, then the word in T3's secondary badge colours and 10 px type, 20 px tall in all. The dark rendition shows on a dark look.apps/web/src/lazurio/brand/, with a note never to edit them.SidebarChrome.tsxswaps T3's small pill for it only where the label is "Lazurio".Scope and approval
This is an overlay change from the Organization Admin's request in #70's thread: "Design máme hotový", with the wireframe PRs above. It ships with the next fork release after 0.1.0-lazurio.2 (#81), preview on Ring 0 first.
Verification
node --test scripts/lazurio-release-contract.test.mjs: 33/33. With the head line removed, the slot test fails (checked).vp run --filter @t3tools/web typecheckpasses.AppSidebarLayout.tsx.main9a38526c(0.1.0-lazurio.2). The contract test and typecheck pass again after the rebase.mainafter merge. The plan is to check it on Ring 0 together with LazurioPlatform#485 (the rail's line) before the stable. The Platform side is already verified in headless Chrome against its hosted preview.Model and harness: Claude Opus 5.5 in Claude Code.
🤖 Generated with Claude Code
Note
Move Lazurio column head below T3 titlebar in
SidebarChromeHeaderAppSidebarLayoutand into a newSidebarChromeHeaderwrapper in SidebarChrome.tsx. The header renders the upstream titlebar first, then thelazurio-column-headelement. The sidebar toggle and wordmark stay on top.LazurioBadgein LazurioBadge.tsx, a 20px badge with the Lazurio symbol at 16px and label. It shows the dark symbol asset under the dark theme and the light one otherwise.AppSidebarLayout.tsx; that file now contains no Lazurio-specific code.SidebarChromeHeader, or if the oldAppSidebarLayout.tsxcolumn-head wiring reappears.Macroscope summarized 2cc4665.